<template>
    <div class="login">
        <div class="wapper">
            <login_form v-if="type === 0"/>
            <regis_form v-if="type === 1"/>
            <p v-if="type === 0" @click="checkout(1)">没有账号?去注册。</p>
            <p v-if="type === 1" @click="checkout(0)">已有账号,去登录。</p>
        </div>
    </div>
</template>
<script setup lang="ts">
import regis_form from './regis_form.vue'
import login_form from './login_form.vue'
import {ref} from 'vue'

const type = ref<number>(0)
const checkout = (flag: number) => {
    type.value = flag
}
</script>
<style scoped lang="scss">
*{
    box-sizing: border-box;
}
.login{
    width: 100vw;
    height: 100vh;
    background-color: #1d243d;
    padding-top: 50px;
    .wapper{
        width: 400px;
        height: 520px;
        margin: 0 auto;
        background-color: #212942;
        border-radius: 9px;
        border-top: 10px solid #79a6fe;
        border-bottom: 10px solid #8BD17C;
        box-shadow: 1px 1px 108.8px 19.2px #191f35;

        p{
            text-align: center;
            color: #5c7fda;
            text-decoration: none;
            cursor: pointer;
        }
    }
}
</style>